<template>
    <div class="main-div-style">
        <div class="content">
            <div class="content-guider">
                <Breadcrumb >
                    <BreadcrumbItem to="/index">首页</BreadcrumbItem>
                    <BreadcrumbItem to="/index/help">帮助中心</BreadcrumbItem>
                    <BreadcrumbItem v-if="current.hd_type">{{current.hd_type}}</BreadcrumbItem>
                    <BreadcrumbItem>{{current.title}}</BreadcrumbItem>
                </Breadcrumb>
            </div>
        </div> 
        <div style="padding:1em 5px">
            <AutoIframe :content="current.content"></AutoIframe>
        </div>
    </div>
</template>

<script>
import HelpDocument from "@/common/model/HelpDocument";
import AutoIframe from "@/common/components/AutoIframe";

export default {
    data(){
        return{
            current: {}
        }
    },
    components: {
        AutoIframe
    },
    created() {
        this.api.post("help/get", { id: this.$route.params.id }, res => {
            this.current = HelpDocument.parse(res.data);
        });
    },
    watch: {
        "$route": function(value) {
        this.api.post("help/get", { id: this.$route.params.id }, res => {
            this.current = HelpDocument.parse(res.data);
        });
        }
    }
};
</script>
<style scoped>
.content {
    border-bottom: 1px solid #cccccc;
    font-size:25px;
    padding: 5px 0 2px;
}
</style>
